<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>步步街Tuding布局超级应用</title>
<link rel="stylesheet" href="../css/_grid.css" />
<style type="text/css">
body{font-size:14px;line-height:20px;
	/*font-family:arial;*/
	/*font:13px/1.231 arial,helvetica,clean,sans-serif;*/
}
#bhead, #bbody, #bfoot, .rowo, .fillo, .rowi, .filli {
  position: relative;
  clear: both;
  *zoom: 1; }

#bhead:after, #bbody:after, #bfoot:after, .rowo:after, .fillo:after, .rowi:after, .filli:after {
  content: "";
  display: block;
  clear: both; }
h1{ line-height:2em;margin:0; }
div.content {
	display:block;
    position: relative;
    text-align: center;
    border:solid #999;
    border-width:1px;
    color:#000;
    padding:5px 0px;
	background:#F9F9F4 url(./img/grid_text.png) 1px 0 repeat;
	margin-right:0px;
	margin:0;
	padding:0;
}
.rowo {
	width:96%;
	margin:0 auto;
	padding:0;
}
.fillo {
}
.nmn .ming{color:red;}
address *{vertical-align:middle;font-family:Dotum;}
@media (max-width: 480px) {
	.rowo{ width:auto; }
	.mn .fillo, .nm .fillo, .mnn .fillo, .nmn .fillo, .nnm .fillo{ padsplit:0;}
	.mn .ming, .mn .n1, .mn .n2,
	.nm .ming, .nm .n1, .nm .n2,
	.mnn .ming, .mnn .n1, .mnn .n2,
	.nmn .ming, .nmn .n1, .nmn .n2,
	.nnm .ming, .nnm .n1, .nnm .n2 {
		width:auto; float:none; margin:0; left:0; right:0; clear:both;
	}
	.rowo .s-1, .rowo .s-1-2, .rowo .s-1-3, .rowo .s-2-3, .rowo .s-1-4, .rowo .s-3-4,
	.rowo .s-1-5, .rowo .s-2-5, .rowo .s-3-5, .rowo .s-4-5,
	.rowo .s-1-6, .rowo .s-5-6, .rowo .s-1-8, .rowo .s-3-8, .rowo .s-5-8, .rowo .s-7-8,
	.rowo .s-1-12, .rowo .s-5-12, .rowo .s-7-12, .rowo .s-11-12,
	.rowo .s-1-24, .rowo .s-5-24, .rowo .s-7-24, .rowo .s-11-24, .rowo .s-13-24, .rowo .s-17-24, .rowo .s-19-24, .rowo .s-23-24 {
		width:100%; float:none;
	}
}
</style>
</head>

<body>
<div class="rowo">
  <h1>步步街Tuding布局超级应用</h1>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-2">
        <div class="content">
          <label>1/2</label>
        </div>
      </div>
      <div class="s-1-2">
        <div class="content">
          <label>1/2</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-3-4">
        <div class="content">
          <label>3/4</label>
        </div>
      </div>
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-3">
        <div class="content">
          <label>1/3</label>
        </div>
      </div>
      <div class="s-1-3">
        <div class="content">
          <label>1/3</label>
        </div>
      </div>
      <div class="s-1-3">
        <div class="content">
          <label>1/3</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-3">
        <div class="content">
          <label>1/3</label>
        </div>
      </div>
      <div class="s-2-3">
        <div class="content">
          <label>2/3</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-5">
        <div class="content">
          <label>1/5</label>
        </div>
      </div>
      <div class="s-2-5">
        <div class="content">
          <label>2/5</label>
        </div>
      </div>
      <div class="s-2-5">
        <div class="content">
          <label>2/5</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-3-5">
        <div class="content">
          <label>3/5</label>
        </div>
      </div>
      <div class="s-2-5">
        <div class="content">
          <label>2/5</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-6">
        <div class="content">
          <label>1/6</label>
        </div>
      </div>
      <div class="s-1-6">
        <div class="content">
          <label>1/6</label>
        </div>
      </div>
      <div class="s-1-6">
        <div class="content">
          <label>1/6</label>
        </div>
      </div>
      <div class="s-1-6">
        <div class="content">
          <label>1/6</label>
        </div>
      </div>
      <div class="s-1-6">
        <div class="content">
          <label>1/6</label>
        </div>
      </div>
      <div class="s-1-6">
        <div class="content">
          <label>1/6</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-6">
        <div class="content">
          <label>1/6</label>
        </div>
      </div>
      <div class="s-5-6">
        <div class="content">
          <label>5/6</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-8">
        <div class="content">
          <label>1/8</label>
        </div>
      </div>
      <div class="s-3-8">
        <div class="content">
          <label>3/8</label>
        </div>
      </div>
      <div class="s-3-8">
        <div class="content">
          <label>3/8</label>
        </div>
      </div>
      <div class="s-1-8">
        <div class="content">
          <label>1/8</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-3-8">
        <div class="content">
          <label>3/8</label>
        </div>
      </div>
      <div class="s-5-8">
        <div class="content">
          <label>5/8</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-7-8">
        <div class="content">
          <label>7/8</label>
        </div>
      </div>
      <div class="s-1-8">
        <div class="content">
          <label>1/8</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
      <div class="s-1-2">
        <div class="content">
          <label>1/2</label>
        </div>
      </div>
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-8">
        <div class="content">
          <label>1/8</label>
        </div>
      </div>
      <div class="s-1-2">
        <div class="content">
          <label>1/2</label>
        </div>
      </div>
      <div class="s-1-8">
        <div class="content">
          <label>1/8</label>
        </div>
      </div>
      <div class="s-1-4">
        <div class="content">
          <label>1/4</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-12">
        <div class="content">
          <label>1/12</label>
        </div>
      </div>
      <div class="s-5-12">
        <div class="content">
          <label>5/12</label>
        </div>
      </div>
      <div class="s-5-12">
        <div class="content">
          <label>5/12</label>
        </div>
      </div>
      <div class="s-1-12">
        <div class="content">
          <label>1/12</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-7-12">
        <div class="content">
          <label>7/12</label>
        </div>
      </div>
      <div class="s-5-12">
        <div class="content">
          <label>5/12</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-11-12">
        <div class="content">
          <label>11/12</label>
        </div>
      </div>
      <div class="s-1-12">
        <div class="content">
          <label>1/12</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-1-24">
        <div class="content">
          <label>1/24</label>
        </div>
      </div>
      <div class="s-5-24">
        <div class="content">
          <label>5/24</label>
        </div>
      </div>
      <div class="s-7-24">
        <div class="content">
          <label>7/24</label>
        </div>
      </div>
      <div class="s-11-24">
        <div class="content">
          <label>11/24</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-17-24">
        <div class="content">
          <label>17/24</label>
        </div>
      </div>
      <div class="s-7-24">
        <div class="content">
          <label>7/24</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-19-24">
        <div class="content">
          <label>19/24</label>
        </div>
      </div>
      <div class="s-5-24">
        <div class="content">
          <label>5/24</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div class="fillo">
    <div class="split">
      <div class="s-23-24">
        <div class="content">
          <label>23/24</label>
        </div>
      </div>
      <div class="s-1-24">
        <div class="content">
          <label>1/24</label>
        </div>
      </div>
    </div>
  </div>
</div>
<hr />
<div class="rowo">
  <div id="colophon">
    <address style="text-align:center;">
    <img src="./img/logo_16px.gif" alt="" />&nbsp;<em>Copyright ©</em> <span><a href="http://www.bubujie.net/" target="_blank">步步街工作室</a> 2008-2012 All Rights Reserved.</span>
    </address>
  </div>
</div>
</body>
</html>
